<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <button onclick="send()">发送</button>
    <script>
        if ("serviceWorker" in navigator) {
            try {
                navigator.serviceWorker.register("service-worker.js", {}).then(registration => {
                    if (registration.installing) {
                        console.log("正在安装 Service worker");
                    } else if (registration.waiting) {
                        console.log("已安装 Service worker installed");
                    } else if (registration.active) {
                        console.log("激活 Service worker");
                    }
                })

            } catch (error) {
                console.error(`注册失败：${error}`);
            }

        }
        navigator.serviceWorker.addEventListener('message', function (e) {
            console.log(e.data);
        })

        function send() {
            navigator.serviceWorker.controller.postMessage('loop')
        }
    </script>
</body>

</html>